<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>添加挂号人</title>
		<link rel="stylesheet" type="text/css" href="../stylesheets/main.css" />
		<script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.2/??flexible_css.js,flexible.js"></script>
		<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
		<style type="text/css">
		</style>
	</head>

	<body class="ovh">
		<header class="fixed-top t0">
			<a class="back"></a>
			<div class="title">标题</div>
		</header>
		<ul class="list-ul mb60 mt103 mb100">
			<li class="pr w hht140 mt15 ovh list-li">
				<div id="con1" class="con bg-white pr icon-enter pull-right">
					<div class="ml20 fz30 hht70">
						<label class="fc-grey">姓&nbsp;&nbsp;&nbsp;&nbsp;名：</label>
						<span class="fz28">刘强</span>
					</div>
					<div class="txt-ellipsis ml20 fz30 hht70">
						<label class="fc-grey">身份证：</label>
						<span class="fz28">3208090197891250051</span>
					</div>
				</div>
				<div class="del">删 除</div>
			</li>
			<li class="pr w hht140 mt15 ovh list-li">
				<div id="con1" class="con bg-white pr icon-enter pull-right">
					<div class="ml20 fz30 hht70">
						<label class="fc-grey">姓&nbsp;&nbsp;&nbsp;&nbsp;名：</label>
						<span class="fz28">刘强</span>
					</div>
					<div class="txt-ellipsis ml20 fz30 hht70">
						<label class="fc-grey">身份证：</label>
						<span class="fz28">3208090197891250051</span>
					</div>
				</div>
				<div class="del">删 除</div>
			</li>
			<li class="pr w hht140 mt15 ovh list-li">
				<div id="con1" class="con bg-white pr icon-enter pull-right">
					<div class="ml20 fz30 hht70">
						<label class="fc-grey">姓&nbsp;&nbsp;&nbsp;&nbsp;名：</label>
						<span class="fz28">刘强</span>
					</div>
					<div class="txt-ellipsis ml20 fz30 hht70">
						<label class="fc-grey">身份证：</label>
						<span class="fz28">3208090197891250051</span>
					</div>
				</div>
				<div class="del">删 除</div>
			</li>
			<li class="pr w hht140 mt15 ovh list-li">
				<div id="con1" class="con bg-white pr icon-enter pull-right">
					<div class="ml20 fz30 hht70">
						<label class="fc-grey">姓&nbsp;&nbsp;&nbsp;&nbsp;名：</label>
						<span class="fz28">刘强</span>
					</div>
					<div class="txt-ellipsis ml20 fz30 hht70">
						<label class="fc-grey">身份证：</label>
						<span class="fz28">3208090197891250051</span>
					</div>
				</div>
				<div class="del">删 除</div>
			</li>
			<li class="pr w hht140 mt15 ovh list-li">
				<div id="con1" class="con bg-white pr icon-enter pull-right">
					<div class="ml20 fz30 hht70">
						<label class="fc-grey">姓&nbsp;&nbsp;&nbsp;&nbsp;名：</label>
						<span class="fz28">刘强</span>
					</div>
					<div class="txt-ellipsis ml20 fz30 hht70">
						<label class="fc-grey">身份证：</label>
						<span class="fz28">3208090197891250051</span>
					</div>
				</div>
				<div class="del">删 除</div>
			</li>

		</ul>

		<a class="btn fixed-bottom" href="">
				添加就诊人
		</a>
		<script type="text/javascript">
			//			$(function() {
			//				$(".list-li").on("swipeleft", function() {
			//					$(this).find("#con1").animate({
			//						left: "-2.03125rem"
			//					}, 500)
			//				}).on("swiperight", function() {
			//					$(this).find("#con1").animate({
			//						left: "0"
			//					}, 500)
			//				})
			//			},function(){
			//				$.mobile.loading('hide');
			//			})
			$(function() {
				var startX, endX;
				document.getElementById("con1").addEventListener("touchstart", touchStart, false);
				document.getElementById("con1").addEventListener("touchmove", touchMove, false);
				document.getElementById("con1").addEventListener("touchend", touchEnd, false);
				//				document.getElementById("con1").addEventListener("touchcancel",touchCancel,false);
				function touchStart(event) {
					var touch = event.touches[0];
					startX = touch.pageX;
				}

				function touchMove(event) {
					var touch = event.touches[0];
					endX = touch.pageX;
					var X = startX - endX;
					console.log("startX:" + startX);
					console.log("endX:" + endX);
					console.log("X:" + X);
					if (X > 40) {
						//向左
						$(this).animate({
							left: "-2.03125rem",
						}, 300);
					} else {
						$(this).animate({
							left: "0",
						}, 300);
					}
				}

			function touchEnd(event) {}
			})
		</script>
	</body>

</html>